<template>
    <div>
        <div v-if="browserRedirect && !showOver">
          <div>
            <div class="extra-wrapper" slot="tabBarExtraContent" style="padding:0;margin-bottom: -20px;margin-top:5px">
              <a-select defaultValue="" @change="changeSpecification" style="width:90%;margin-left: 5%;">
                <a-select-option key="" value="">请选择</a-select-option> 
                <a-select-option v-for="(val,index) in colList" :key="val.itemPatch" :value="val.id">{{val.productName+"/批次-"+val.itemPatch}}</a-select-option>
              </a-select>
            </div>
            <a-tabs @change="callback" default-active-key="1" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
              <a-tab-pane loading="true" tab="在售剧本" key="1" style="min-height: 100vh;">
                <ul style="margin: 0;padding:0;list-style-type: none;">
                  <li v-for="val in dataSource" class="liCommSty">
                    <div style="display: flex;border-bottom: 1px solid #EBEBEB;padding-bottom: 20px;">
                      <img v-if="val.personPoster && val.personPoster.indexOf(',') == -1" :src="val.personPoster" style="width:90px;height:90px;" alt="产品海报图">
                      <img v-if="val.personPoster && val.personPoster.indexOf(',') != -1" :src="val.personPoster.split(',')[0]" style="width:90px;height:90px;" alt="产品海报图">
                      <span v-if="!val.personPoster" style="width:90px;height:90px;text-align: center;line-height: 90px;">暂无图片</span>
                      <div style="padding-left:15px;">
                        <div style="font-size: 14px;font-weight: bold;">
                          <span>{{val.productName}}</span>
                          <span style="position: absolute;right: 15px;" @click="detailsCli(val,2)">详情</span>
                        </div>
                        <div style="font-size: 14px;font-weight: bold;color:#888;max-height: 50px;overflow: hidden;text-overflow: ellipsis;">一句话简介：{{val.productInfo}}</div>
                        <div style="font-size: 14px;font-weight: bold;color:#666;">
                          <span>总量：{{val.total}}</span>
                          <span style="position: absolute;right: 15px;color:#FF5252;font-size: 16px;">¥{{val.wholesalePrice}}</span>
                        </div>
                      </div>
                    </div>
                    <div style="margin-top: 20px;">
                      <span>作者</span>
                      <span style="float: right;">{{val.author}}</span>
                    </div>
                    <div style="margin-top: 10px;">
                      <span>正式发售时间</span>
                      <span style="float: right;">{{val.publicTime}}</span>
                    </div>
                    <div style="margin-top: 10px;">
                      <span>批次</span>
                      <span style="float: right;">{{val.itemPatch}}</span>
                    </div>
                  </li>
                </ul>
                <a-pagination showQuickJumper :defaultCurrent="ipagination.current" :total="ipagination.total" @change="onChange"/>
              </a-tab-pane>
            </a-tabs>
          </div>
          <BlockProductStandardsAll v-if="showAll" :listData="listData" @returnUp="returnUp"></BlockProductStandardsAll>
        </div>
        <div class="page-header-index-wide" v-if="!browserRedirect && !showOver">
          <a-card :loading="loading" :bordered="false" :body-style="{padding: '0'}">
            <div class="salesCard">
              <a-tabs @change="callback" class="tabsSty" default-active-key="1" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
                  <div class="extra-wrapper" slot="tabBarExtraContent">
                    <a-select defaultValue="" @change="changeSpecification1" class="selSty" style="left:480px;">
                      <a-select-option key="" value="">请选择</a-select-option> 
                      <a-select-option v-for="(val,index) in dataSource1List" :key="val.itemPatch" :value="val.productName">{{val.productName+"/批次-"+val.itemPatch}}</a-select-option>
                    </a-select>
                    <a-select defaultValue="" @change="changeSpecification" class="selSty">
                      <a-select-option key="" value="">请选择</a-select-option> 
                      <a-select-option v-for="(val,index) in colList" :key="val.itemPatch" :value="val.id">{{val.productName+"/批次-"+val.itemPatch}}</a-select-option>
                    </a-select>
                    <Button type="primary" style='margin-right:30px;' @click="jump(5)">添加预售剧本</Button>
                  </div>
                <a-tab-pane loading="true" tab="在售剧本" key="2">
                  <a-row style="padding:0 15px 28px 15px;" class="rowTab">
                        <a-table
                      :columns="columns"
                      :dataSource="dataSource"
                      :pagination="ipagination"
                      :loading="loading"
                      @change="handleTableChange">
                      <template slot="htmlSlot" slot-scope="text, record">
                        <div style="height:90px;display: flex;">
                          <div style="display: inline-block;">
                            <img v-if="record.personPoster && record.personPoster.indexOf(',') == -1" :src="record.personPoster" style="width:90px;height:90px;" alt="产品海报图">
                            <img v-if="record.personPoster && record.personPoster.indexOf(',') != -1" :src="record.personPoster.split(',')[0]" style="width:90px;height:90px;" alt="产品海报图">
                            <span v-if="!record.personPoster" style="width:90px;height:90px;text-align: center;line-height: 90px;">暂无图片</span>
                          </div>
                          <div style="display: inline-block;line-height: 26px;margin-left:10px;">
                            <div style="font-size: 14px;font-weight: bold;">{{record.productName}}</div>
                            <div style="font-size: 14px;font-weight: bold;color:#888;max-height: 50px;overflow: hidden;text-overflow: ellipsis;">一句话简介：{{record.productInfo}}</div>
                            <div style="font-size: 14px;font-weight: bold;color:#666;">批次：{{record.itemPatch}}</div>
                          </div>
                        </div>
                      </template>
                      <template slot="total" slot-scope="text, record">
                        <div style="font-size: 14px;font-weight: bold;">{{record.total+"/"+(record.total-record.bindNumber)}}</div>
                      </template>
                      <template slot="imgSlot" slot-scope="text">
                        <span v-if="!text" style="font-size: 12px;font-style: italic;">无此图片</span>
                        <img v-else :src="getImgView(text)" height="25px" alt="图片不存在" style="max-width:80px;font-size: 12px;font-style: italic;"/>
                      </template>
                      <template slot="fileSlot" slot-scope="text">
                        <span v-if="!text" style="font-size: 12px;font-style: italic;">无此文件</span>
                        <a-button
                          v-else
                          :ghost="true"
                          type="primary"
                          icon="download"
                          size="small"
                          @click="uploadFile(text)">
                          下载
                        </a-button>
                      </template>
          
                      <span slot="action" slot-scope="text, record">
                        <!-- <a v-if="!record.total" @click="handleEdit(record)">编辑</a>
                        <a v-if="!record.total"-divider type="vertical" /> -->
                        <a v-if="record.applyStatus == null" href="javascript:;" @click="codeCli(record)">申请正版码</a>
                        <a-divider v-if="record.applyStatus == null" type="vertical" />
                        <a v-if="record.applyStatus == null || record.applyStatus == 2" href="javascript:;" @click="detailsCli(record,1)">编辑</a>
                        <a-divider v-if="record.applyStatus == null || record.applyStatus == 2" type="vertical" />
                        <a v-if="record.applyStatus == 0 || record.applyStatus == 1 || record.applyStatus == 3" href="javascript:;" @click="addItemPath(record)">增加批次</a>
                        <a-divider v-if="record.applyStatus == 0 || record.applyStatus == 1 || record.applyStatus == 3" type="vertical" />
                        <a v-if="record.applyStatus == 0 || record.applyStatus == 1 || record.applyStatus == 3" href="javascript:;" @click="detailsCli(record,2)">详情</a>
                        <a-divider v-if="record.applyStatus == 0 || record.applyStatus == 1 || record.applyStatus == 3" type="vertical" />
                        <!-- <a href="javascript:;" @click="deleteCli(record)">删除</a> -->
                        <a-popconfirm title="确定删除吗?" @confirm="() => deleteCli(record)">
                          <a>删除</a>
                        </a-popconfirm>
                      </span>
                    </a-table>
                  </a-row>
                </a-tab-pane>
                <a-tab-pane loading="true" tab="预售剧本" key="1">
                  <a-row style="padding:0 15px 28px 15px;" class="rowTab">
                        <a-table
                      :columns="columns"
                      :dataSource="dataSource1"
                      :pagination="ipagination1"
                      :loading="loading"
                      @change="handleTableChange1">
                      <template slot="htmlSlot" slot-scope="text, record">
                        <div style="height:90px;display: flex;">
                          <div style="display: inline-block;" v-if="record.personPoster">
                            <img v-if="record.personPoster && record.personPoster.indexOf(',') == -1" :src="record.personPoster" style="width:90px;height:90px;" alt="产品海报图">
                            <img v-if="record.personPoster && record.personPoster.indexOf(',') != -1" :src="record.personPoster.split(',')[0]" style="width:90px;height:90px;" alt="产品海报图">
                            <!-- <img v-if="!val.personPoster" src="" alt="暂无图片"> -->
                            <span v-if="!record.personPoster" style="width:90px;height:90px;text-align: center;line-height: 90px;">暂无图片</span>
                          </div>
                          <div style="display: inline-block;line-height: 26px;margin-left:10px;">
                            <div style="font-size: 14px;font-weight: bold;">{{record.productName}}</div>
                            <div style="font-size: 14px;font-weight: bold;color:#888;max-height: 50px;overflow: hidden;text-overflow: ellipsis;">一句话简介：{{record.productInfo}}</div>
                            <div style="font-size: 14px;font-weight: bold;color:#666;">批次：{{record.itemPatch}}</div>
                          </div>
                        </div>
                      </template>
                      <template slot="imgSlot" slot-scope="text">
                        <span v-if="!text" style="font-size: 12px;font-style: italic;">无此图片</span>
                        <img v-else :src="getImgView(text)" height="25px" alt="图片不存在" style="max-width:80px;font-size: 12px;font-style: italic;"/>
                      </template>
                      <template slot="fileSlot" slot-scope="text">
                        <span v-if="!text" style="font-size: 12px;font-style: italic;">无此文件</span>
                        <a-button
                          v-else
                          :ghost="true"
                          type="primary"
                          icon="download"
                          size="small"
                          @click="uploadFile(text)">
                          下载
                        </a-button>
                      </template>
          
                      <span slot="action" slot-scope="text, record">
                        <a href="javascript:;" @click="detailsCli(record,1)">编辑</a>
                        <a-divider type="vertical" />
                        <a href="javascript:;" @click="handleOkFuter(record.id)">预售转在售</a>
                      </span>
                    </a-table>
                  </a-row>
                </a-tab-pane>
              </a-tabs>
            </div>
            <a-modal title="转在售剧本" v-model="visible" @ok="handleOk" style="text-align: center;">
              <p>您确定要将该剧本转为在售剧本吗，此操作不可撤销，请谨慎操作！</p>
            </a-modal>
            <a-modal title="增加批次" :confirmLoading="showTrue" v-model="visibleAgean" @ok="handleAgainOk" style="text-align: center;">
              <div>
                <span>批次：</span>
                <a-input style="width:50%;" placeholder="请输入批次" v-model="itemPathVal"></a-input>
              </div>
              <div style="margin-top:20px;">
                <span>总量：</span>
                <a-input-number :min="1" :max="100" style="width:50%;" placeholder="请输入总量" v-model="totalVal"></a-input-number>
              </div>
            </a-modal>
            <BlockProductStandardsAll v-if="showAll" :listData="listData" @returnUp="returnUp"></BlockProductStandardsAll>
            <BlockProductApplyModal v-if="showCode" :listCodeData="listCodeData" @returnUp="returnUp"></BlockProductApplyModal>
            <blockProductStandards-modal ref="modalForm" @ok="modalFormOk"></blockProductStandards-modal>
          </a-card>
        </div>
        <a-card :bordered="false" v-if="showOver">
          <img src="../../assets/close_icon.svg" style="position: absolute;top: 28px;right: 20px;z-index:1000;" @click="showOver = false" alt="">
            <a-tabs @change="callback" type="card">
              <a-tab-pane tab="添加预售剧本" key="1">
                  <div style='background-color: #fff;padding:20px 30px;'>
                      <a-steps :current="current" style="margin-bottom: 50px;width:60%;">
                          <a-step>
                          <template slot="title">
                              基础信息
                          </template>
                          <!-- <span slot="description"></span> -->
                          </a-step>
                          <a-step>
                          <template slot="title">
                              剧本详细信息
                          </template>
                          <!-- <span slot="description"></span> -->
                          </a-step>
                          <a-step>
                          <template slot="title">
                              资料上传
                          </template>
                          <!-- <span slot="description"></span> -->
                          </a-step>
                      </a-steps>
                      <a-form :form="form" style="width:60%;">
                          <div v-show="tab1Show">
                          <a-row>
                              <a-col :xl="24" :lg="24" :md="24" :sm="24" :xs="24" >
                              <span style="font-size: 16px;font-weight: bold;display: inline-block;margin-bottom: 30px;">基础信息</span>   
                              </a-col>
                          </a-row>
                          <a-row>
                              <a-form-item label="剧本名称" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                                  <a-input v-decorator="[ 'productName', validatorRules.productName]" placeholder="请输入剧本名称"></a-input>
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="作者" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <a-input v-decorator="[ 'author', validatorRules.author]" placeholder="请输入作者"></a-input>
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="批次" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <a-input v-decorator="[ 'itemPatch', validatorRules.itemPatch]" placeholder="请输入批次"></a-input>
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="总量" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <a-input-number :min="1" :max="1000" v-decorator="[ 'total', validatorRules.total]" placeholder="请输入总量" style="width: 100%"/>
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="零售价格" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <a-input v-decorator="[ 'wholesalePrice', validatorRules.wholesalePrice]" placeholder="请输入零售价格"></a-input>
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="设置标签" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <template v-for="(tag, index) in tags">
                                  <a-tooltip v-if="tag.length > 20" :key="tag" :title="tag">
                                  <a-tag :key="tag" :closable="index !== 0" :afterClose="() => handleClose(tag)">
                                      {{`${tag.slice(0, 20)}...`}}
                                  </a-tag>
                                  </a-tooltip>
                                  <a-tag v-else :key="tag" closable :afterClose="() => handleClose(tag)">
                                  {{tag}}
                                  </a-tag>
                              </template>
                              <a-input
                                  v-if="inputVisible && showTagLen"
                                  ref="input"
                                  type="text"
                                  size="small"
                                  :style="{ width: '78px' }"
                                  :value="inputValue"
                                  @change="handleInputChange"
                                  @blur="handleInputConfirm"
                                  @keyup.enter="handleInputConfirm"
                              />
                              <a-tag v-if="!inputVisible && showTagLen" @click="showInput" style="background: #fff; borderStyle: dashed;">
                                  <a-icon type="plus" /> New Tag
                              </a-tag>
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="正式发行时间" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <j-date placeholder="请选择正式发行时间" v-decorator="[ 'publicTime', validatorRules.publicTime]" :trigger-change="true" style="width: 100%"/>
                              </a-form-item>
                          </a-row>
                          <div style="width:100%;">            
                              <Button type="primary" style='margin-left:20%;display: block;width: 20%;' @click="nextStep(0)">下一步</Button>
                          </div>
                          </div>
                          <div v-show="tab2Show">
                          <a-row>
                              <a-col :xl="24" :lg="24" :md="24" :sm="24" :xs="24">              
                              <span style="font-size: 16px;font-weight: bold;display: inline-block;margin-bottom: 30px;">剧本详细信息</span>  
                              </a-col>
                          </a-row>
                          <a-row>
                              <a-form-item label="剧本人数" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <a-select defaultValue="" style="width:40%;" v-model="manSel">
                                  <a-select-option v-for="(vals,index) in listPerson" :key="vals.val" :value="index">{{vals.name}}</a-select-option>
                              </a-select>
                              <div style="display: inline-block;" v-if="manSel == 0">
                                  <a-input-number :min="1" placeholder="剧本人数" v-model="detailNum1" style="width: 50%;margin-left:10%;"/> 人
                              </div>
                              <div style="display: inline-block;width:100%;" v-if="manSel == 1">
                                  <div style="display: inline-block;margin-left:10%;width: 35%;">
                                  男 <a-input-number :min="1" placeholder="剧本人数(男)" v-model="detailNum2" style="width: 60%;"/> 人
                                  </div>
                                  <div style="display: inline-block;margin-left:10%;width: 35%;">
                                  女 <a-input-number :min="1" placeholder="剧本人数(女)" v-model="detailNum3" style="width: 60%;"/> 人
                                  </div>
                              </div>
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="剧本简介" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <a-textarea v-decorator="[ 'detailInfo', validatorRules.detailInfo]" placeholder="请输入剧本简介" style="width: 100%"/>
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="一句话简介" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <a-textarea v-decorator="[ 'productInfo', validatorRules.productInfo]" placeholder="请输入一句话简介" style="width: 100%"/>
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="剧本实景" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <j-dict-select-tag type="radio" v-decorator="['playReality', validatorRules.playReality]" :trigger-change="true" dictCode="play_reality" placeholder="请选择剧本实景"/>
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="剧本形式" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <j-multi-select-tag type="checkbox" v-decorator="['playbillForm', validatorRules.playbillForm]" :trigger-change="true" dictCode="playbiil_form" placeholder="请选择剧本形式"/> 
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="剧本类型" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <j-multi-select-tag type="checkbox" v-decorator="['playbillType', validatorRules.playbillType]" :trigger-change="true" dictCode="playbill_type" placeholder="请输入剧本类型"/>
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="适合人群" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <j-multi-select-tag type="checkbox" v-decorator="['belongtoCrowd', validatorRules.belongtoCrowd]" :trigger-change="true" dictCode="belongto_crowd" placeholder="请选择适合人群"/>
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="游戏时间" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <a-input-number :min="1" v-decorator="[ 'playTime', validatorRules.playTime]" placeholder="请输入游戏时间"/>小时
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="道具支持" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <j-dict-select-tag type="radio" v-decorator="['propStatus', validatorRules.propStatus]" :trigger-change="true" dictCode="prop_status" placeholder="请选择道具支持"/>
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="剧本供应买断状态" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <j-dict-select-tag type="radio" v-decorator="['buyoutStatus', validatorRules.buyoutStatus]" :trigger-change="true" dictCode="buyout_status" placeholder="请选择买断状态"/>
                          </a-form-item>
                          </a-row>
                          <div style="width:100%;">
                              <Button type="primary" style='margin-left: 10%;width: 12%;display: inline-block;' @click="nextStep(3)">上一步</Button>
                              <Button type="primary" style='margin-left: 10%;width: 12%;display: inline-block;' @click="nextStep(1)">下一步</Button>
                          </div>
                          </div>
                          <div v-show="tab3Show">
                          <a-row>
                              <a-col :xl="24" :lg="24" :md="24" :sm="24" :xs="24">
                              <span style="font-size: 16px;font-weight: bold;display: inline-block;margin-bottom: 30px;">资料上传</span>  
                              </a-col>
                          </a-row>
                          <a-row>
                              <a-form-item label="剧本实拍图" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <j-upload v-decorator="['personPoster', validatorRules.personPoster]" :trigger-change="true"></j-upload>
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="剧本海报" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <j-upload v-decorator="['playbillPoster', validatorRules.playbillPoster]" :trigger-change="true"></j-upload>
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="人物海报" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <j-upload v-decorator="['productImages', validatorRules.productImages]" :trigger-change="true"></j-upload>
                              </a-form-item>
                          </a-row>
                          <a-row>
                              <a-form-item label="道具资料" :labelCol="labelCol" :wrapperCol="wrapperCol" class="textLeft">
                              <j-upload v-decorator="['propData', validatorRules.propData]" :trigger-change="true"></j-upload>
                              </a-form-item>
                          </a-row>
                          <div style="width:100%;">
                              <Button type="primary" style='margin-left: 2%;width: 12%;display: inline-block;' @click="nextStep(4)">上一步</Button>
                              <Button type="primary" :disabled="showSub" style='margin-left: 7%;display: inline-block;width: 13%;' @click="handleOkPro">提交</Button>
                          </div>
                          </div>
                      </a-form>
                  </div>
              </a-tab-pane>
            </a-tabs>
        </a-card>
    </div>
  </template>
  
  <script>
    import { Button,Icon,Modal } from 'ant-design-vue';
    import { browserRedirect } from '@/utils/util'
    // import { JeecgListMixin } from '@/mixins/JeecgListMixin'
    import ChartCard from '@/components/ChartCard'
    import ACol from "ant-design-vue/es/grid/Col"
    import ATooltip from "ant-design-vue/es/tooltip/Tooltip"
    import MiniArea from '@/components/chart/MiniArea'
    import MiniBar from '@/components/chart/MiniBar'
    import MiniProgress from '@/components/chart/MiniProgress'
    import RankList from '@/components/chart/RankList'
    import Bar from '@/components/chart/Bar'
    import LineChartMultid from '@/components/chart/LineChartMultid'
    import HeadInfo from '@/components/tools/HeadInfo.vue'
    import { httpAction,getAction,putAction,deleteAction,postAction } from '@/api/manage'
    import { axios } from '@/utils/request'
    import { mapActions, mapGetters,mapState } from 'vuex'
    import {initDictOptions, filterMultiDictText} from '@/components/dict/JDictSelectUtil'
    import BlockProductStandardsAll from '../block/modules/BlockProductStandardsAll'
    import BlockProductApplyModal from './BlockProductApplyModal.vue'
    import BlockProductStandardsModal from '../block/modules/BlockProductStandardsModal'
    import JDate from '@/components/jeecg/JDate'  
  import JUpload from '@/components/jeecg/JUpload'
  import JDictSelectTag from "@/components/dict/JDictSelectTag"
  import JMultiSelectTag from "@/components/dict/JMultiSelectTag"
  
    import Trend from '@/components/Trend'
    import { getLoginfo,getHomeData } from '@/api/api'
  
    export default {
      name: "IndexChart",
      // mixins:[JeecgListMixin],
      components: {
        JDictSelectTag,
        JMultiSelectTag,
        JDate,
        JUpload,
        BlockProductStandardsModal,
        ATooltip,
        ACol,
        ChartCard,
        MiniArea,
        MiniBar,
        MiniProgress,
        RankList,
        Bar,
        Icon,
        Trend,
        LineChartMultid,
        HeadInfo,
        Button,
        Modal,
        BlockProductStandardsAll,
        BlockProductApplyModal
      },
      data() {
        return {
            url: {
                add: "/exhibition/exhibition_product_standards_new/add",
                sub: "/exhibition/exhibition_product_standards_new/preSaleToSale"
            },
            current: 0,
            inputValue: '',
            manSel:0,
            tags: [],
            detailNum1:"",
            detailNum2:"",
            detailNum3:"",
            listPerson:[
                {
                    name:"男女不限",
                    val:"1"
                },
                {
                    name:"男女有限制",
                    val:"2"
                }
            ],
            form: this.$form.createForm(this),
            inputVisible: false,
            showSub:false,
            showTagLen:true,
            labelCol: {
                xs: { span: 24 },
                sm: { span: 4 },
            },
            wrapperCol: {
                xs: { span: 24 },
                sm: { span: 10 },
            },
            validatorRules: {
                id: {rules: [
                    {required: false, message: '请选择预售剧本类型!'},
                ]},
                newOldStatus: {rules: [
                    {required: false, message: '请选择剧本类型!'},
                ]},
                oldStandardid: {rules: [
                    {required: false, message: '请选择在售剧本!'},
                ]},
                productName: {rules: [
                    {required: true, message: '请输入剧本名称!'},
                ]},
                itemPatch: {rules: [
                    {required: false, message: '请输入剧本批次!'},
                ]},
                itemType: {rules: [
                ]},
                total: {rules: [
                    {required: false, message: '请输入总量!'},
                ]},
                saleTotal: {rules: [
                ]},
                catalogId: {rules: [
                ]},
                labelTags: {rules: [
                ]},
                author: {rules: [
                ]},
                productInfo: {rules: [
                ]},          
                playReality: {rules: [
                ]},
                wholesalePrice: {rules: [
                ]},
                itemCode: {rules: [
                ]},
                detailInfo: {rules: [
                ]},
                productImages: {rules: [
                ]},
                playbillPoster: {rules: [
                    // {required: true, message: '请上传剧本海报!'},
                ]},
                personPoster: {rules: [
                    // {required: true, message: '请上传人物海报!'},
                ]},
                publicTime: {rules: [
                    // {required: true, message: '请选择正式发行时间!'},
                ]},
                proPublicTime: {rules: [
                    // {required: true, message: '请选择剧本小类!'},
                ]},
                preSaleTotal: {rules: [
                    // {required: true, message: '请选择剧本小类!'},
                ]},
                preWholesalePrice: {rules: [
                    // {required: true, message: '请选择剧本小类!'},
                ]},
                playbillForm: {rules: [
                    // {required: true, message: '请选择剧本形式!'},
                ]},
                playbillType: {rules: [
                    // {required: true, message: '请输入剧本类型!'},
                ]},
                playbillBackground: {rules: [
                    // {required: true, message: '请选择剧本小类!'},
                ]},
                belongtoCrowd: {rules: [
                    // {required: true, message: '请选择适合人群!'},
                ]},
                playTime: {rules: [
                    // {required: true, message: '请输入游戏时间!'},
                ]},
                sendgoodTime: {rules: [
                ]},
                supportLogistics: {rules: [
                ]},
                propStatus: {rules: [
                    // {required: true, message: '请选择道具支持!'},
                ]},
                propData: {rules: [
                    // {required: true, message: '请上传道具资料!'},
                ]},
                buyoutStatus: {rules: [
                    {required: false, message: '请选择买断状态!'},
                ]},
            },
            tab1Show:true,
            tab2Show:false,
            tab3Show:false,
          showOver:false,
          userTotal:0,
          userAuth2btn:"",
          browserRedirect:false,
          approveStatus:"",
          showTrue:false,
          itemPatchList:"",
          visibleAgean:false,
          itemPathVal:"",
          totalVal:"",
          visible: false,
          imageurl:"",
          showAll:false,
          showCode:false,
          urlImg:"",
          listData:{},
          dataSource1:[],
          dataSource1List:[],
          ipagination1:{
            current: 1,
            pageSize: 10,
            showTotal: (total, range) => {
              return range[0] + "-" + range[1] + " 共" + total + "条"
            },
            showQuickJumper: true,
            total: 0
          },
          ipagination:{
            current: 1,
            pageSize: 10,
            showSizeChanger:false,
            showTotal: (total, range) => {
              return range[0] + "-" + range[1] + " 共" + total + "条"
            },
            showQuickJumper: true,
            total: 0
          },
          products_total:"0",
          shopkeeper_total:"0",
          yesterday_scan_total:"0",
          user_avatar:"",
          factory_name:"",
          loading: true,
          center: null,
          dataSource:[],
          loginfo:{},
          colList:[],
          listCodeData:{},
          initData:{
            createBy: "",
            createTime: "",
            flag: "",
            id: "",
            loginTime: "",
            manufacturerId: "",
            phone: "",
            updateBy: "",
            updateTime: "",
            userName: ""
          },
          issuerId:"",
          futerId:"",
          // url: {
          //   list: "/block/blockProductStandards/list"
          // },
          columns: [
            // {
            //   title: '#',
            //   dataIndex: '',
            //   key:'rowIndex',
            //   width:60,
            //   align:"center",
            //   customRender:function (t,r,index) {
            //     return parseInt(index)+1;
            //   }
            // },
            {
              title:'剧本名称',
              align:"left",
              width:"25%",
              dataIndex: 'productName',
              scopedSlots: { customRender: 'htmlSlot' }
            },
            {
              title:'作者',
              align:"center",
              dataIndex: 'author'
            },
            {
              title:'总量/剩余',
              align:"center",
              dataIndex: 'total',
              scopedSlots: { customRender: 'total' }
            },
            {
              title:'零售价格',
              align:"center",
              dataIndex: 'wholesalePrice'
            },
            {
              title:'标签',
              align:"center",
              dataIndex: 'labelTags'
            },
            {
              title:'正式发行时间',
              align:"center",
              dataIndex: 'publicTime'
            },
            {
              title: '操作',
              dataIndex: 'action',
              align:"center",
              scopedSlots: { customRender: 'action' }
            }
          ],
        }
      },
      mounted() {
        this.browserRedirect = browserRedirect();
        // this.urlImg = window._CONFIG['imgDomainURL']+'/';
        this.urlImg ="";
        this.initLogInfo();
        this.indataList();
        this.listInfo();
        this.futerList();
        getAction("/block/blockManufacturerInfo/userAuth2btn")
          .then(res => {
            if (res.success) {
              this.userAuth2btn = res.result.status;
              if(res.result.status == 3){
                this.issuerId = "";
                this.listInfoSingUp();
                return
              }
              let list={
                column: "createTime",
                order: "desc",
                field: "id,,factoryName,companyProfile,createTime,type,name,status,address,phone,imageurl,action",
                pageNo: 1,
                pageSize: 5
              };
              getAction("/block/blockManufacturerInfo/list",list).then((res)=>{
                if (res.success) {
                  this.issuerId = res.result.records[0].id;
                  this.listInfoSingUp();
                } else {
                  this.$message.warning(res.message)
                }
              })
            } else {
              this.$message.warning(res.message)
            }
          })
      },
      watch:{
            tags(val){
                if(val.length>5){
                this.showTagLen = false;
                }else{
                this.showTagLen = true;
                }
            }
        },
      methods: {
        handleClose(removedTag) {
            const tags = this.tags.filter(tag => tag !== removedTag);
            this.tags = tags;
        },

        showInput() {
            this.inputVisible = true;
            this.$nextTick(function() {
            this.$refs.input.focus();
            });
        },

        handleInputChange(e) {
            this.inputValue = e.target.value;
        },

        handleInputConfirm() {
            const inputValue = this.inputValue;
            let tags = this.tags;
            if (inputValue && tags.indexOf(inputValue) === -1) {
            tags = [...tags, inputValue];
            }
            Object.assign(this, {
            tags,
            inputVisible: false,
            inputValue: '',
            });
        },
        callback(key){
            if(key == 1){
            var param={
                productStandardsId: "1216548480059949057",
                order: "asc",
                field: "",
                pageNo: 1,
                pageSize: 1000
            };
            getAction("/block/blockProductStandards/list",param).then((res) => {
                if (res.success) {
                this.specification = res.result.records;
                }
                if(res.code===510){
                this.$message.warning(res.message)
                }
            })
            }
            if(key == 2){
            getAction("exhibition/exhibition_product_standards_new/getShowData").then((res) => {
                if (res.success) {
                this.specificationFuter = res.result;
                }
                if(res.code===510){
                this.$message.warning(res.message)
                }
            })
            }
        },
        handleOkPro () {
            const that = this;
            // 触发表单验证
            this.form.validateFields((err, values) => {
            if (!err) {
                this.showSub = true;
                // values.catalogId = "1216548439660412929";
                // values.itemType = "1216548480059949057";
                values.ManufacturerId = that.issuerId;
                var arrList="";
                for(let i=0,len=this.tags.length;i<len;i++){
                if(i == 0){
                    arrList = this.tags[0];
                }else{
                    arrList+=","+this.tags[i];
                }
                }
                if(arrList){
                  values.labelTags = arrList;
                }
                if(this.manSel == 0){
                    values.playbillNumber = this.detailNum1;
                }
                if(this.manSel == 1){
                    values.playbillNumber = this.detailNum2+","+this.detailNum3;
                }
                let httpurl = '';
                let method = '';
                httpurl+=this.url.add;
                method = 'post';
                values.newOldStatus = 1;
                httpAction(httpurl,values,method).then((res)=>{
                  this.futerList();
                  this.current = 0;
                  if(res.success){
                      that.$message.success(res.message);
                  }else{
                      that.$message.warning(res.message);
                  }
                  this.tab1Show = true;
                  this.tab2Show = false;
                  this.tab3Show = false;
                }).finally(() => {
                this.tab1Show = true;
                this.tab2Show = false;
                this.tab3Show = false;
                })
            }         
            })
        },
        nextStep(num){
            const that = this;
            // 触发表单验证
            if(num == 3){
                this.tab1Show = true;
                this.tab2Show = false;
                this.current = 0;
            }
            if(num == 4){
                this.tab2Show = true;
                this.tab3Show = false;
                this.current = 1;
            }
            if(num == 0){
                if(this.form.getFieldValue('productName')){
                    this.tab1Show = false;
                    this.tab2Show = true;
                    this.current = 1;
                }else{
                    this.$message.warning("请输入剧本名称！");
                    return
                }
            // if (this.form.getFieldValue('productName') && this.form.getFieldValue('total')) {            
            //     this.tab1Show = false;
            //     this.tab2Show = true;
            //     this.current = 1;
            // }else{
            //     this.form.validateFields((err, values) => {
            //     })
            // }
            }    
            if(num == 1){
                // if(this.form.getFieldValue('playbillForm')){
                //     if(this.form.getFieldValue('playbillForm').indexOf("1,2")!=-1 || this.form.getFieldValue('playbillForm').indexOf("1,3")!=-1 || this.form.getFieldValue('playbillForm').indexOf("2,3")!=-1
                //     || this.form.getFieldValue('playbillForm').indexOf("1,2,3")!=-1 || this.form.getFieldValue('playbillForm').indexOf("4,5,6")!=-1 || this.form.getFieldValue('playbillForm').indexOf("4,5")!=-1
                //     || this.form.getFieldValue('playbillForm').indexOf("4,6")!=-1 || this.form.getFieldValue('playbillForm').indexOf("5,6")!=-1){
                //         this.$message.warning("剧本形式选择格式有误！");
                //         return
                //     }
                // }
                if(this.manSel == 0 && !this.detailNum1){
                    this.$message.warning("请输入剧本人数！");
                    return
                }
                if(this.manSel == 1 && (!this.detailNum2 || !this.detailNum3)){
                    this.$message.warning("请输入剧本人数！");
                    return
                }
                // if (this.form.getFieldValue('buyoutStatus')) {            
                //     this.tab2Show = false;
                //     this.tab3Show = true;
                //     this.current = 2;
                // }else{
                //     this.form.validateFields((err, values) => {
                //     if(!err){
                //         this.tab2Show = false;      
                //         this.tab3Show = true;
                //         this.current = 2;
                //     }
                //     })
                // }
                this.tab2Show = false;
                this.tab3Show = true;
                this.current = 2;
            }
        },
        jumpApplyList(){
          this.$router.push('/block/BlockProductShopApplyList')
        },
        onChange(pageNumber) {
          this.ipagination.current = pageNumber;
          this.indataList();
        },
        addItemPath(record){
          this.itemPatchList = record;
          this.itemPathVal="";
          this.totalVal="";
          this.visibleAgean=true;
        },
        handleAgainOk(){
        //   if(!this.itemPathVal){
        //     this.$message.warning("请输入批次！");
        //     return
        //   }
        //   if(!this.totalVal){
        //     this.$message.warning("请输入总量！");
        //     return
        //   }
          this.itemPatchList.applyStatus=0;
          this.itemPatchList.id="";
          this.itemPatchList.itemPatch = this.itemPathVal;
          this.itemPatchList.total = this.totalVal;
          this.showTrue=true;
          postAction("/block/blockProductStandards/add",this.itemPatchList).then((res) => {
            this.showTrue=false;
            if(res.success){
              this.visibleAgean=false;
              this.indataList();
              this.$message.success(res.message);
            }else{
              this.$message.warning(res.message);
            }
          })
        },
        handleOk(e){
          this.visible = false;
          putAction("/exhibition/exhibition_product_standards_new/preSaleToSale",{id:this.futerId}).then((res) => {
            if(res.success){
              this.$message.success(res.message);
            }else{
              this.$message.warning(res.message);
            }
            this.indataList();
            this.futerList();
          })
        },
        handleOkFuter(id){
          this.futerId = id;
          this.visible = true;
        },
        callback(key){
          if(key == 1){
            this.indataList();
          }
          if(key == 2){
            this.futerList();
          }
        },
        listInfoSingUp(){
          getAction("https://blockinsight.com.cn/scriptPlay/third/yesterdayBoostNum?issuerId="+this.issuerId).then((res) => {
            if (res.success) {
              this.yesterday_scan_total = res.data;
            }
            if(res.code===510){
              this.$message.warning(res.message)
            }
          })
        },
        listInfo(){
          var that = this;
          let list={
            column: "createTime",
            order: "desc",
            field: "id,,factoryName,companyProfile,createTime,type,name,status,address,phone,imageurl,action",
            pageNo: 1,
            pageSize: 5
          };
          getAction("/block/blockManufacturerInfo/list",list).then((res)=>{
            if (res.success) {
              this.userTotal = res.result.total;
              this.approveStatus = res.result.records[0].status;
              if(res.result.records[0].imageurl){
                that.imageurl = res.result.records[0].imageurl;
              }else{
                that.imageurl = "";
              }
              that.$forceUpdate();
            } else {
              that.$message.warning(res.message)
            }
          })        
        },
        jumpStep(num){
          if(num == 1){
            this.$router.push("/block/BlockManufacturerInfoMessageList")
          }
          if(num == 2){
            this.$router.push("/block/BlockProductInfoList")
          }
          if(num == 3){
            this.$router.push("/block/BlockProductBindInfoList")
          }
        },
        modalFormOk() {
          this.indataList();
          this.futerList();
        },
        deleteCli(record){
          var param={
              id:record.id
            };
          deleteAction("/block/blockProductStandards/delete",param).then((res) => {
              if (res.success) {
                this.$message.success(res.message);
                this.indataList();
              }
              if(res.code===510){
                this.$message.warning(res.message)
              }
            })
        },
        codeCli(record){
          postAction("/block/blockProductStandards/judgeDataIntergrity?id="+record.id,{'id':record.id}).then((res) => {
              if (!res.success) {
                this.$message.warning("剧本信息不完整,请先补充完整剧本信息！")
                this.detailsCli(record,1);
              }else{
                if(record.applyStatus == 2 || record.applyStatus == null){
                  this.showCode = true;
                  this.listCodeData = record;
                }else if(record.applyStatus == 0){
                  this.$message.success("您的二维码正在等待审核，请耐心等待！")
                }else if(record.applyStatus == 1){
                  this.$message.success("您的二维码审批已通过！")
                }else{
                  this.$message.success("您的二维码正在审核中，请耐心等待！")
                }
              }
            })
        },
        futerList(){
          var param={
              order: "asc",
              field: "",
              pageNo: this.ipagination1.current,
              pageSize: 10
            };
          getAction("exhibition/exhibition_product_standards_new/getShowData").then((res) => {
              if (res.success) {
                // this.ipagination1.total = res.result.total;
                this.dataSource1 = res.result;
                this.dataSource1List = res.result;
              }
              if(res.code===510){
                this.$message.warning(res.message)
              }
            })
        },
        changeSpecification1(value,option){
          if(value==""){
            this.futerList();
          }else{
            var params={
              productName: value,
              itemPatch:option.key,
              column:"createTime",
              order: "asc",
              field: "",
              pageNo: 1,
              pageSize: 10
            };
            getAction("exhibition/exhibition_product_standards_new/getShowData",params).then((res) => {
              if (res.success) {
                this.dataSource1 = res.result;
                // this.ipagination1.total = res.result.total;
              }
              if(res.code===510){
                this.$message.warning(res.message)
              }
            })
          }
        },
        changeSpecification(value,option){
          if(value==""){
            this.indataList();
          }else{
            var params={
              productStandardsId: value,
              id:value,
              itemPatch:option.key,
              order: "asc",
              pageNo: this.ipagination.current,
              pageSize: 10
            };
            getAction("/block/blockProductStandards/listToHome",params).then((res) => {
              if (res.success) {
                this.dataSource = res.result.records;
                this.ipagination.total = res.result.total;
              }
              if(res.code===510){
                this.$message.warning(res.message)
              }
            })
          }
        },
        ...mapGetters(["nickname", "avatar","userInfo"]),
        getAvatar(){
          return window._CONFIG['imgDomainURL']+"/"+this.avatar()
        },
        handleTableChange(pagination, filters, sorter) {
          //TODO 筛选
          if (Object.keys(sorter).length > 0) {
            this.isorter.column = sorter.field;
            this.isorter.order = 'ascend' === sorter.order ? 'asc' : 'desc';
          }
          this.ipagination = pagination;
          this.indataList();
        },
        handleTableChange1(pagination, filters, sorter) {
          //TODO 筛选
          if (Object.keys(sorter).length > 0) {
            this.isorter.column = sorter.field;
            this.isorter.order = 'ascend' === sorter.order ? 'asc' : 'desc';
          }
          this.ipagination1 = pagination;
          this.futerList();
        },
        detailsCli(record,num){
          if(num == 1){
            this.$forceUpdate();
            // this.handleEdit(record);
            this.$refs.modalForm.edit(record);
            this.$refs.modalForm.title = "编辑";
            this.$refs.modalForm.disableSubmit = false;
          }else{
            this.showAll=true;
            this.listData = record;
          }
        },
        returnUp(data){
          this.showAll = data;
          this.showCode = data;
          this.indataList();
        },
        jump(num){
          if(num == 1){
            this.$router.push("/block/BlockCategoryList")
          }
          if(num == 2){
            this.$router.push("/block/BlockManufacturerInfoMessageList")
          }
          if(num == 3){
            this.$router.push("/block/BlockCustomerInfoList")
          }
          if(num == 4){
            this.$router.push("/block/BlockCustomerSearchList")
          }
          if(num == 5){
            this.showOver = true;
          }
          if(num == 6){
            this.$router.push("/block/BlockManufacturerInfoList")
          }
        },
        indataList(){
          var params={
            order: "asc",
            pageNo: this.ipagination.current,
            pageSize: 10
          };
          getAction("/block/blockProductStandards/listToHome",params).then((res) => {
            if (res.success) {
              this.dataSource = res.result.records;
              this.colList = res.result.records;
              this.ipagination.total = res.result.total;
            }
            if(res.code===510){
              this.$message.warning(res.message)
            }
            this.loading = false;
          })
        },
        initLogInfo () {
          getAction("/block/blockManufacturerInfo/getHomeData").then((res) => {
            if (res.success) {
              if(res.result.manufacturerUser){
                this.initData = res.result.manufacturerUser;
              }
              this.products_total = res.result.products_total.toString();
              this.shopkeeper_total = res.result.shopkeeper_total.toString();
              this.shopkeeper_total = res.result.shopkeeper_total.toString();
              this.user_avatar = res.result.user_avatar;
              this.factory_name = res.result.factory_name;
            }
            if(res.code===510){
              this.$message.warning(res.message)
            }
            this.loading = false;
          })
        },
      }
    }
  </script>
  
  <style lang="scss" scoped>
    .tabsSty /deep/ .ant-tabs-tab:last-child{
      margin-left: 219px;
    }
    .liCommSty{
      background-color: #fff;
      padding:15px;
      margin-bottom: 10px;
      border-radius: 6px;
    }
    .divTopSty{
      background-color: #404B70;
      height:225px;
      padding:20px 10px;
    }
    .selSty{
      width: 12%;
      position: absolute;
      left: 140px;
      top: 16px;
      z-index: 10;
    }
    .rowTab /deep/ .ant-table-fixed-header .ant-table-scroll .ant-table-header {
      overflow: scroll hidden !important;
    }
    .greenColor{
      color: #00c39b;
    }
    .redColor{
      color: #FF4767;
    }
    .borderSty{
      background: #fff;
      height:181px;
      border-radius: 4px;
      padding: 20px 24px 8px;
    }
    .circle-cust{
      position: relative;
      top: 28px;
      left: -100%;
    }
    .extra-wrapper {
      line-height: 55px;
      padding-right: 24px;
  
      .extra-item {
        display: inline-block;
        margin-right: 24px;
  
        a {
          margin-left: 24px;
        }
      }
    }
  
    /* 首页访问量统计 */
    .head-info {
      position: relative;
      text-align: left;
      padding: 0 32px 0 0;
      min-width: 125px;
  
      &.center {
        text-align: center;
        padding: 0 32px;
      }
  
      span {
        color: rgba(0, 0, 0, .45);
        display: inline-block;
        font-size: .95rem;
        line-height: 42px;
        margin-bottom: 4px;
      }
      p {
        line-height: 42px;
        margin: 0;
        a {
          font-weight: 600;
          font-size: 1rem;
        }
      }
    }
  </style>